@layout("/common/_container.html"){
<style>
    ul{padding: 0;margin: 0;}
    #ulBox{display: flex} #ulBox>li{flex: 1;} #ulBox>li li{margin: 15px 0}
    #ulBox>li span{display: inline-block ; width: 90px;}
    .frameBox{width: 60%;height: 32px;padding-left: 10px;border: 1px solid #cccccc;border-radius: 5px;}
    .btnBox{float: right;margin-top: 15px;}
    .btnBox>button{margin: 0;  color: white;  background: #2eadd0;  width: 100px;  font-size: 1em;border: 1px solid #cccccc}
</style>
<div class="ibox float-e-margins">
    <div class="ibox-content">
        <div class="form-horizontal" id="customerInfoForm">
            <div style="display: none">
                <input type="hidden" id="customerId" value="${customerInfo.id}">
                <input type="hidden" id="reservationsId" value="${customerInfo.reservationsId}">
                <input type="hidden" id="id" value="">
                <input type="hidden" id="provinceValue" value="${customerInfo.province}">
                <input type="hidden" id="citiesValue" value="${customerInfo.cities}">
                <input type="hidden" id="regionValue" value="${customerInfo.region}">
                <input type="hidden" id="oneChannelValue" value="${customerInfo.oneChannel}">
                <input type="hidden" id="twoChannelValue" value="${customerInfo.twoChannel}">
                <input type="hidden" id="thrChannelValue" value="${customerInfo.thrChannel}">
                <input type="hidden" id="oneMediumValue" value="${customerInfo.oneMedium}">
                <input type="hidden" id="twoMediumValue" value="${customerInfo.twoMedium}">
                <input type="hidden" id="thrMediumValue" value="${customerInfo.thrMedium}">
                <input type="hidden" id="sexValue" value="${customerInfo.customerSex}">
            </div>
            <div class="row">
                <div class="col-sm-12">
                    <ul id="ulBox">
                        <li>
                            <ul>
                                <li>
                                    <span>姓名</span>
                                    <input type="text" id="customerName" class="frameBox" value="${customerInfo.customerName}">
                                </li>
                                <li>
                                    <span>年龄</span>
                                    <input type="text" id="customerAge" class="frameBox" value="${customerInfo.customerAge}">
                                </li>
                                <li>
                                    <span>一级渠道</span>
                                    <select name="oneChannel" id="oneChannel" class="frameBox"></select>
                                </li>
                                <li>
                                    <span>一级媒介</span>
                                    <select name="oneMedium" id="oneMedium" class="frameBox"></select>
                                </li>
                                <li>
                                    <span>省份</span>
                                    <select name="province" id="province" class="frameBox"></select>
                                </li>
                            </ul>
                        </li>
                        <li>
                            <ul>
                                <li>
                                    <span>电话</span>
                                    <input type="text" id="customerPhone" class="frameBox"  value="${customerInfo.customerPhone}">
                                </li>
                                <li>
                                    <span>性别</span>
                                    <select name="customerSex" id="customerSex" class="frameBox">
                                         <option value="1">男</option>
                                        <option value="2">女</option>
                                    </select>
                                </li>
                                <li>
                                    <span>二级渠道</span>
                                    <select name="twoChannel" id="twoChannel" class="frameBox"></select>
                                </li>
                                <li>
                                    <span>二级媒介</span>
                                    <select name="twoMedium" id="twoMedium" class="frameBox"></select>
                                </li>
                                <li>
                                    <span>城市</span>
                                    <select name="cities" id="cities" class="frameBox"></select>
                                </li>
                            </ul>
                        </li>
                        <li>
                            <ul>
                                <li>
                                    <span>客户状态</span>
                                    <input type="text" name="customerStatus" id="customerStatus" disabled="disabled" class="frameBox" value="预约">
                                </li>
                                <li>
                                    <span>生日</span>
                                    <input type="date" id="birthday" name="birthday"
                                           class="frameBox" onclick="laydate({istime: false, format: 'YYYY-MM-DD'})"  value="${customerInfo.birthday}">
                                </li>
                                <li>
                                    <span>三级渠道</span>
                                    <select name="thrChannel" id="thrChannel" class="frameBox"></select>
                                </li>
                                <li>
                                    <span>三级媒介</span>
                                    <select name="thrMedium" id="thrMedium" class="frameBox"></select>
                                </li>
                                <li>
                                    <span>区域</span>
                                    <select name="region" id="region" class="frameBox"></select>
                                </li>
                            </ul>
                        </li>
                    </ul>
                </div>

                <div class="col-sm-12">
                    <div class="clearfix">
                        <div>
                            <button type="button" class="btn" id="ensure" onclick="CustomerInfoDlg.updateCustomerInfo()">提交</button>
                            <button type="button" class="btn" id="cancel" onclick="CustomerInfoDlg.close()"  style="background: #da6792" >取消</button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<script src="${ctxPath}/static/modular/arrival/customer/customer_infos.js"></script>
<script src="${ctxPath}/static/js/common/jsAddresss.js"></script>
<script src="${ctxPath}/static/js/common/jsChannel.js"></script>
<script src="${ctxPath}/static/js/common/jsMedium.js"></script>
<script type="text/javascript">
    document.getElementById("provinceValue").value = "湖北";
    document.getElementById("citiesValue").value = "武汉";
    document.getElementById("regionValue").value = "市辖区";
    var regioni = document.getElementById("regionValue").value;
    var provincei = document.getElementById("provinceValue").value;
    var citiesi = document.getElementById("citiesValue").value;
    var oneChanneli = document.getElementById("oneChannelValue").value;
    var twoChanneli = document.getElementById("twoChannelValue").value;
    var thrChanneli = document.getElementById("thrChannelValue").value;
    var oneMediumi = document.getElementById("oneMediumValue").value;
    var twoMediumi = document.getElementById("twoMediumValue").value;
    var thrMediumi = document.getElementById("thrMediumValue").value;
    var ChannelList;
    var MediumList;
    oneChanneli = "直接上门";
    //初始化下拉渠道列表
    $.post(Feng.ctxPath + "/channel/getChannelsss", function (data) {
        ChannelList = data;
        channelInit('oneChannel', 'twoChannel', 'thrChannel');
    }, "json");
    //初始化下拉媒介列表
    $.post(Feng.ctxPath + "/medium/getMedium", function (data) {
        MediumList = data;
        mediumInit('oneMedium', 'twoMedium', 'thrMedium');
    }, "json");
    addressInit('province', 'cities', 'region');
    //性别
    var sexValue = document.getElementById("sexValue").value;
    if (sexValue != "") {
        $("#customerSex option[value=" + sexValue + "]").attr("selected", "selected");
    }
</script>
@}
